<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
    <title>奖牌排行榜</title>
    <style>
        table tr th{
            text-align: center;
        }
    </style>
</head>

<link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<body>


<div >
	<h1 align="center">奥运会奖牌排行榜</h1>


    <table class="table table-hover" style="text-align: center">
        <tr>
            <th>排序</th>
            <th>国家</th>
            <th>金牌</th>
            <th>银牌</th>
            <th>铜牌</th>
            <th>奖牌总数</th>
            <th width="200px">操作</th>
        </tr>
		<div >
			 <tr class="success" th:each="u:${ranks}">
				<td th:text="${u.id}">ID</td>
				<td th:text="${u.countryName}">中国</td>
				<td th:text="${u.goldCount}">52</td>
				<td th:text="${u.silverCount}">52</td>
				<td th:text="${u.bronzeCount}">52</td>
				<td th:text="${u.allCount}">52</td>
<!--				<td>金:<a href="javascript:goldin()"  class="glyphicon glyphicon-plus"></a>-->
				<td>金:<a th:href="|javascript:goldin('${u.countryName}','1000')|"  class="glyphicon glyphicon-plus"></a>
				<a th:href="|javascript:goldin('${u.countryName}','-1000')|"  class="glyphicon glyphicon glyphicon-minus"></a>
				&ensp;&ensp;银:<a th:href="|javascript:goldin('${u.countryName}','1')|"  class="glyphicon glyphicon-plus"></a>
				<a th:href="|javascript:goldin('${u.countryName}','-1')|"  class="glyphicon glyphicon glyphicon-minus"></a>
				&ensp;&ensp;铜:<a th:href="|javascript:goldin('${u.countryName}','0.001')|"  class="glyphicon glyphicon-plus"></a>
				<a th:href="|javascript:goldin('${u.countryName}','-0.001')|"  class="glyphicon glyphicon glyphicon-minus"></a>
				</td>
			</tr>
		</div>

    </table>
</div>

</body>

<script type="text/javascript">


	function goldin(data,score){
		console.log(data)
		$.ajax({
			type: "GET",
			data: {"countryName":data,"score":score},
			url:"/goldIn",
			success: function(){
				console.log("success")
				window.location.href="[[@{/listRank}]]"
			}
		})
	}
  
</script>
</html>